import React from 'react'
import {View, Image, ScrollView } from 'react-native'
import { Dialog, Lt, Color, Label, Images, Touch, Jpp, Jx, Navigator, Flist } from "../_utils"
import { Net, NET_GET, NET_NR } from "../_net"
import { eApp, cHome} from "../home/_home"
import { TouchGoodsHor } from './ApplyGoods';
import { ViewMajors, ViewHotCakes } from './ApplyHotMajor';

// 点击图标
class TouchApp extends React.PureComponent{
    render(){
        const {onPress, source, title} = this.props;
        return <Touch onPress = {onPress}>
            <View style = {{alignItems:"center",}}>
                <Image source={source}/>
                <Label style={{color:Color.c3}}>{title}</Label>
            </View>
        </Touch>
    }
}


// 分割
class ViewSection extends React.PureComponent{
    render(){
        const {style, source, title, children} = this.props;
        return <View style = {{margin:Lt.margin, marginTop:20, flexDirection:"row", alignItems:"center", ...style}}>
            <View style = {{flexDirection:"row", alignItems:"center"}}>
                <Image source = {source}/>
                <Label style = {{marginLeft:Lt.margin, fontSize:Lt.c18, color:Color.c3}}>{title}</Label>
            </View>
            {children}
        </View>
    }
}

export class TouchApps extends React.PureComponent{
    render(){
        const { onAppIdx } = this.props;
        return <View style = {{padding:Lt.pad, marginTop:Lt.margin, flexDirection:"row", justifyContent:"space-around"}}>
        {
            eApp.idxs.map((v,i)=>{
                return <Touch key= {i} onPress = {()=>{ onAppIdx && onAppIdx(i); }}>
                    <Image source={eApp.images[v]}/>
                </Touch>
                return <TouchApp 
                    key= {i} 
                    title={eApp.names[v]} 
                    source={eApp.images[v]} 
                    onPress={ ()=>{ onAppIdx && onAppIdx(i); }}
                />
            })
        }
        </View>;
    }
}


export class ApplyHome extends React.PureComponent{
    constructor(props){
        super(props);

        this.onAppIdx = this.onAppIdx.bind(this);
        this.onHotCakeMore = this.onHotCakeMore.bind(this);
        this.onLoad = this.onLoad.bind(this);
        this.onItem = this.onItem.bind(this);
    }
    onAppIdx(appIdx){
        Navigator.push("Apps", {appIdx})
    }
    onHotCakeMore(){
        Navigator.push("ApplyMajor", {opt:5, title:"爆款宝贝"})
    }
    onLoad(params){
        const c_maxpp = 8;
        // 0 轮播图
        if(params.page < c_maxpp){
            params.add1(1);
            return;
        }
        Net.request("taobao/opt?opt=6&" + Flist.toPageStr(params.page - c_maxpp, params.maxpp), null, {NET_GET, NET_NR, params}).then(r=>{
            if(r.data){
                params.add(r.data.data);
            }else{
                params.add();
            }
        });
    }

    onItem(params){
        const index = params.index;
        const item = params.item;

        if((index >= 0 && index <= 2)){
            return <View style = {{height:1}}/>;
        }
        // if(index == 0){
        //     return <HomeBanner/>;
        // }
        // // 1 touchApp
        // if(index == 1){
        //     return <TouchApps onAppIdx={this.onAppIdx}/>;
        // }
        // // 2 播报抽奖
        // if(index == 2){
        //     return <HomeBonus onGuide={this.onGuide} onBonus = {this.onBonus}/>;
        // }
        // 34 大牌好券
        if(index == 3){
            return <ViewSection title={"大牌好券"} source={Images.dapai}/>
        }
        if(index == 4){
            return <ViewMajors onMajor={this.onMajor}/>
        }
        // 56 爆款宝贝
        if(index == 5){
            return <ViewSection style={{justifyContent:"space-between"}} title={"爆款宝贝"} source={Images.baokuan}>
                <Touch onPress = {this.onHotCakeMore}>
                    <Label style = {{paddingVertical:5, paddingLeft:30, fontSize:Lt.c16, color:Color.c9,}}>更多 ></Label>
                </Touch>          
            </ViewSection>
        }
        if(index == 6){
            return <ViewHotCakes/>
        }
        // 78 为您精选
        if(index == 7){
            return <ViewSection title={"为您精选"} source={Images.jingxuan}/>;
        }

        const newData = cHome.toData(item, eApp.rdxs[eApp.TB]);
        return <TouchGoodsHor wh = {100} data = {newData}/>
    }
    render(){
        return <Flist 
            style={{flex:1}}
            onLoad = {this.onLoad}
            onItem = {this.onItem}
        />
    }
}